<template>
	<div>
		<div class="selected_nav">
			<el-tabs v-model="activeName" @tab-click="handleClick">
				<el-tab-pane label="热门" name="first"></el-tab-pane>
				<el-tab-pane label="最新" name="second"></el-tab-pane>
			</el-tabs>
		</div>

		<gallery ref="mychild"></gallery>


	</div>
</template>

<script>
	import gallery from './gallery.vue';

	export default {
		data() {
			return {
				activeName: 'first',
				shownpics:0,
			}
		},
		components: {
			gallery,
		},
		created() {
			// get_photo({kind: 1, price_type:0, page_num:1000,sort:2}).then(res => {
			// 	console.log(res.data.data.photo_list);
			// 	this.$store.commit("change_gallery_arr", res.data.data.photo_list);
			// })
			this.$store.dispatch("get_photo_vux", {
				kind: 1,
				price_type: 0,
				page_num: 1000,
				sort: 2
			})
		},
		methods: {
			
			handleClick(tab) {
				if (tab.name == 'first') {
					this.$store.dispatch("get_photo_vux", {
						kind: 1,
						price_type: 0,
						page_num: 1000,
						sort: 2
					})
					this.$refs.mychild.origin_shownpics();
					
				} else {
					this.$store.dispatch("get_photo_vux", {
						kind: 1,
						price_type: 0,
						page_num: 1000,
						sort: 1
					})
					this.$refs.mychild.origin_shownpics();
					console.log(this)
				}
			},

		},
	}
</script>

<style lang="scss" scoped>
	.selected_nav {
		text-align: center;
	}

	::v-deep .el-tabs__header {
		display: flex;
		justify-content: center;
	}
</style>
